/* Кнопки чатов */
.chat-list {
    margin-top: 10px;
    padding: 15px;
    background: rgba(0,0,0,.3);
    border-radius: 20px;
}

.chat-list .chat-item {
    display: flex !important;
    align-items: center !important;
    padding: 10px !important;
    margin-bottom: 10px;
    //background: rgb(39,84,233);
    border-radius: 6px;
    
    transition: all .3s;
}

.chat-item:hover {
    background: rgb(245,103,22) !important;
}

.chat-item:hover a {
    text-decoration: none !important;
    color: #fff !important;
}

.training-logo-course {
    flex: 0 0 50px !important;
    border: 1px solid rgba(255,255,255,0.31);
}

.chat-title {
    padding-right: 10px;
    font-size: 14px;
    font-family: 'Philosopher', sans-serif;
    color: #fff;
    line-height: 1;
}

.chat-text br {
    display: none;
}
/* Чаты в уроке */

body > .chat-widget {
    top: 10px;
    bottom: 10px;
    right: 10px;
    height: calc(100% - 20px);
    
    border-radius: 10px;
    background: url(https://fs.getcourse.ru/fileservice/file/download/a/586882/sc/430/h/54b1ad5d6072bcabcdee8e2f4893cef1.png) no-repeat center top / contain, radial-gradient(111.26% 61.72% at 62.74% 39.61%, #e7f9e7 0%, #c4d7c6 100%);
    
    z-index: 10000;
}



@media (min-width: 992px) {
    .chat-collapsed {
        height: 50px;
        width: 50px !important;

        border-radius: 50px;

        color: #523973 !important;
        box-shadow: 0 0 10px 0 rgba(0,0,0,.2);
    }
}


.chat-collapse-btn,
.chat-expand-btn {
    top: 10px !important;
    width: 30px;
    height: 30px;
    text-align: center;
    align-content: center;
    border-radius: 50px;
    
    color: #523973 !important;
    box-shadow: 0 0 10px 0 rgba(0,0,0,.2);
}

.chat-expand-btn {
    right: 10px;
    box-shadow: none;
}

/* Чат */
body > .chat-widget .comment-form-wrapper {
    border-radius: 10px;
    left: 10px;
    bottom: 10px;
    width: calc(100% - 20px);
}

body > .chat-widget .date-divider,
body > .comments-tree-wrapper .date-divider {
    margin: 20px 0 20px;
    text-align: center;
    border: none;
}

body > .chat-widget .date-divider span,
body > .comments-tree-wrapper .date-divider span {
    display: inline-block;
    height: auto !important;
    padding: 5px 15px !important;
    color: #fff;
    line-height: 1;
    background: rgba(0,0,0,.4) !important;
    border-radius: 20px;
}

body > .chat-widget .comment-wrapper .comment,
body > .comments-tree-wrapper .comment {
    position: relative;
    margin-bottom: 10px;
    padding: 10px;
    background: #fff !important;
    border-radius: 10px;
}

body > .chat-widget .comment-wrapper .comment {
    min-height: 70px
}

body > .comments-tree-wrapper .comments-top-level > .level-1 > div > .comment {
    padding-left: 75px;
}

body > .comments-tree-wrapper .level-2 {
    margin-bottom: 10px;
}

body > .comments-tree-wrapper .comment-wrapper {
    padding: 0 !important;
    margin-bottom: 0 !important;
}
body > .comments-tree-wrapper .level-2 .comment {
    margin-bottom: 0 !important;
}

body > .chat-widget .comment-wrapper .comment-level,
body > .comments-tree-wrapper .comment-level {
    position: relative;
}

body > .chat-widget .comment-wrapper .comment-level.level-2::before,
body > .comments-tree-wrapper .level-2::before {
    content: '';
    position: absolute;
    top: 50%;
    left: 0;
    
    transform: translatey(-50%);
    width: 5px;
    height: 90%;
    background: rgba(82,57,115,0.62);
    border-radius: 10px;
}

body > .comments-tree-wrapper .comments-tree .level-2 .comment-wrapper {
    margin-left: 10px;
    background: none;
}

body > .chat-widget .comments-tree .level-2 .comment-wrapper {
    padding-right: 0 !important;
}

body > .chat-widget .comment-wrapper .comment .title {
    display: block;
}

body > .chat-widget .comment-wrapper .comment .title .text::after {
    content: '';
}

body > .comments-tree-wrapper .level-1 > .comment-wrapper > .comment > .text  {
    padding-bottom: 0;
}

body > .chat-widget .user-image-wrapper,
body > .comments-tree-wrapper .user-image-wrapper {
    display: block;
    width: 50px !important;
    height: 50px !important;
    border-radius: 100px;
    overflow: hidden;
}

body > .comments-tree-wrapper .comments-top-level > .level-1 > div > .comment .user-image-wrapper {
    position: absolute;
    top: 10px;
    left: 10px;
}

body > .comments-tree-wrapper .level-2 .comment .user-image-wrapper {
    float: right;
    width: 30px !important;
    height: 30px !important;
}

body > .chat-widget form .user-image-wrapper,
body > .comments-tree-wrapper form .user-image-wrapper {
    display: none;
}

body > .chat-widget .comment-time {
    display: block;
}

body > .comments-tree-wrapper .comment-time {
    margin-top: 10px;
}

body > .comments-tree-wrapper .b-like .button,
body > .comments-tree-wrapper .b-comment-reply .button {
    border: none;
}

body > .chat-widget .pseudo-link {
    position: absolute;
    top: 10px;
    right: 10px;
    font-weight: 300;
    font-size: 12px !important;
    text-transform: capitalize;
    color: rgba(51,51,51,0.8);
    text-decoration: none;
}

.gc-comment-form.comment-form-wrapper {
    margin: 0 0 10px !important;
}

/* Форма комментариев */
body > .chat-widget .comment-form-wrapper,
body > .comments-tree-wrapper .gc-comment-form.comment-form-wrapper {
    padding: 15px 10px 10px !important;
    background: #fff !important;
    border-radius: 10px;
}

body > .chat-widget .comments .comment-form-wrapper {
    position: static;
    margin-top: 10px !important;
    width: 100% !important;
    bottom: inherit;
    box-shadow: 0 0 10px rgba(0,0,0,.2);
}

body > .chat-widget .comment-form-wrapper .textarea-block,
body > .comments-tree-wrapper .textarea-block {
    display: flex;
    flex-wrap: wrap;
    justify-content: start;
    align-items: center;
    width:  100%;
}

body > .chat-widget .comment-form-wrapper .btn-send .text,
body > .comments-tree-wrapper .btn-send .text {
    display: none;
}

body > .chat-widget .comment-form-wrapper .online-users-count,
body > .chat-widget .comment-form-wrapper .audio-comment,
body > .comments-tree-wrapper .online-users-count,
body > .comments-tree-wrapper .audio-comment {
    display: none !important;
}

body > .chat-widget .comment-form-wrapper .attach-file-button-container {
    position: absolute !important;
    left: 280px;
}

body > .comments-tree-wrapper .attach-file-button-container{
    position: absolute !important;
    right: 80px;
}

body > .chat-widget .comment-form-wrapper .emoji-container,
body > .comments-tree-wrapper .comment-form-wrapper .emoji-container {
    flex: 1 1;
    margin-right: 10px;
}

body > .chat-widget .comment-form-wrapper .emoji-container textarea,
body > .comments-tree-wrapper .comment-form-wrapper .emoji-container textarea {
    min-height: 50px !important;
    padding: 10px;
    border-radius: 5px;
}

body > .chat-widget .comment-form-wrapper .btn-send,
body > .comments-tree-wrapper .comment-form-wrapper .btn-send {
    display: block;
    flex:  0 0 40px;
    margin: 0 !important;
    width: 40px;
    height: 40px;
    padding: 0;
    border-radius: 40px;
}

body > .chat-widget .comment-form-wrapper .file-uploader,
body > .comments-tree-wrapper  .comment-form-wrapper .file-uploader {
    flex: 1 1 100%;
    margin: 0;
}


body > .comments-tree-wrapper .fa-money,
body > .comments-tree-wrapper .fa-graduation-cap,
body > .comments-tree-wrapper .b-notifications-subscribe,
body > .comments-tree-wrapper .word-separator:nth-child(1),
body > .comments-tree-wrapper .download-csv {
    display: none !important;
}

@media (max-width: 992px) {
    body > .comments-tree-wrapper {
        margin: 0 20px 80px;
        padding: 15px;
        top: 10px;
        bottom: 10px;
        right: 10px;
        height: calc(100% - 20px);

        border-radius: 10px;
        background: url(https://fs.getcourse.ru/fileservice/file/download/a/586882/sc/430/h/54b1ad5d6072bcabcdee8e2f4893cef1.png) no-repeat center top / cover, radial-gradient(111.26% 61.72% at 62.74% 39.61%, #e7f9e7 0%, #c4d7c6 100%);

        z-index: 10000;
    }
    
    body > .comments-tree-wrapper .chat-collapse-btn {
	    display: none;
	}
}